<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>cesium 相机控制</title>
    <link rel="stylesheet" href="/Cesium-1.72/Build/Cesium/Widgets/widgets.css">
    <script src="/Cesium-1.72/Build/Cesium/Cesium.js"></script>
    <script src="/Cesium-1.72/Apps/Sandcastle/Sandcastle-header.js"></script>
    <link rel="stylesheet" href="/Cesium-1.72/Apps/Sandcastle/templates/bucket.css">
</head>
<body style="background-color: #fff;">
    <div style="width:1500px;height:700px;">
        <div id="toolbar" style="z-index: 999;"></div>
        <div id="cesiumContainer" style="width:100%;height:100%;"></div>
    </div>
</body>
</html>
<script>

    var viewer = new Cesium.Viewer('cesiumContainer', {
        imageryProvider:new Cesium.UrlTemplateImageryProvider({
            url:'http://localhost:8099/basemap_0-10/{z}/{y}/{x}.png', //本机地图服务
            fileExtension : "png",
        }),
        geocoder:false, //一种地理位置搜索工具，用于显示相机访问的地理位置。默认使用微软的Bing地图。
        homeButton:true, //首页位置，点击之后将视图跳转到默认视角。
        sceneModePicker:true, //切换2D、3D 和 Columbus View (CV) 模式。
        baseLayerPicker:false, //选择三维数字地球的底图（imagery and terrain）。
        navigationHelpButton:true, //帮助提示，如何操作数字地球。
        animation:false,//控制视窗动画的播放速度。
        creditsDisplay:false, //展示商标版权和数据源。
        timeline:false, //展示当前时间和允许用户在进度条上拖动到任何一个指定的时间。
        fullscreenButton:true, //视察全屏按钮
    });
    viewer.scene.globe.enableLighting = true;//启用以太阳为光源的地球

    Sandcastle.addDefaultToolbarButton('相机定位', function() {
        //相机定位
        viewer.camera.flyTo({
            destination: Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 150000.0),
        });
    });

    function flyInACity(){
        //相机定位
        viewer.camera.flyTo({
            destination: Cesium.Cartesian3.fromDegrees(116.2, 39.4, 550000.0),
        });
    }

    Sandcastle.addToolbarMenu([
        {
            text: "Camera Options",
        },
        {
            text: "Fly in a Beijing",
            onselect: function () {
                flyInACity();
                Sandcastle.highlight(flyInACity);
            },
        }
        ]);
</script>